import React from "react"
import useLatest from "../../hooks/uselatest.ts"
import { useEffect, useState } from "react"

const TryUseLatest = () => {
  const [count, setCount] = useState(0)

  const ref = useLatest(count)

  useEffect(() => {
    const interval = setInterval(() => {
      console.log("count的值:", count)

      console.log("ref的值0:", ref)

      // setCount(count + 1) // 不使用 useLatest

      setCount(ref.current + 1) // 使用 useLatest
    }, 1000)

    return () => clearInterval(interval)
  }, [])

  const changeTest = () => {
    setCount(count + 1)
    console.log(333, count)
    console.log(444, ref)
  }

  return (
    <>
      <div onClick={changeTest}>Try UseLatest</div>
      <div>Count: {count}</div>
    </>
  )
}

export default TryUseLatest
